import dayjs from 'dayjs'
import { useState } from 'react'
import DataBoardHeader from './DataBoardHeader'
import DataBoardMain from './DataBoardMain'
import './index.less'
import { ConditionsType } from './types'

const DataBoard = ({ id }: { id: string }) => {
  const [condition, setCondition] = useState<ConditionsType>({
    id,
    type: 'day',
    user: 'all',
    platform: 'all',
    timeRange: [dayjs().subtract(1, 'day').startOf('day'), dayjs().subtract(1, 'day').startOf('day')]
  })
  const [countDate, setCountDate] = useState('')
  return (
    <div className="application-data-board-container">
      <DataBoardHeader countDate={countDate} condition={condition} onConditionChange={setCondition}></DataBoardHeader>
      <DataBoardMain condition={condition} setCountDate={setCountDate}></DataBoardMain>
    </div>
  )
}

export default DataBoard
